<script setup lang="ts"></script>

<template>
    <div class="major-search">
        <div class="search-wrapper">
            <span>专业：</span>
            <a-input
                :style="{ width: '160px', height: '25px', fontSize: '10px' }"
                allow-clear
            />
            <span>开始时间：</span>
            <a-date-picker
                style="width: 140px; height: 25px"
                placeholder="请输入时间"
            />
            <span>开班状态：</span>
            <a-input
                :style="{ width: '90px', height: '25px', fontSize: '10px' }"
                placeholder="请填写状态"
                allow-clear
            />
            <span>剩余名额：</span>
            <a-input-number
                :style="{ width: '115px', height: '25px' }"
                class="input-demo"
                :min="0"
                :max="100"
            />
            <br />
            <span>封班时间：</span>
            <a-date-picker
                style="width: 140px; height: 25px"
                placeholder="请输入时间"
            />
        </div>
        <div class="btn-wrapper">
            <a-button type="primary" class="btn-top">查询</a-button>
            <a-button type="primary" class="btn-top add-btn">添加</a-button>
            <br />
            <a-button class="btn-top del-btn">删除</a-button>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.major-search {
    width: 100%;
    height: 170px;
    overflow: hidden;
    .search-wrapper {
        width: 75%;
        float: left;
        span {
            font-size: 15px;
            margin-left: 14px;
            line-height: 60px;
            .a-input {
                font-size: 10px;
            }
        }
    }
    .btn-wrapper {
        width: 25%;
        float: right;
        .btn-top {
            background-color: #1890ff;
            color: #ffffff;
            border-radius: 5px;
            margin-top: 10px;
            width: 60px;
            height: 30px;
        }
        .add-btn {
            margin-left: 50px;
        }
        .del-btn {
            margin-left: 110px;
            background-color: #ffffff;
            color: #000000;
            border: 1px solid #777;
            margin-top: 25px;
        }
    }
}
</style>

<style>
.major-search .arco-picker-suffix .arco-picker-suffix-icon {
    display: none !important;
}

.major-search .arco-input-wrapper .arco-input.arco-input-size-medium {
    font-size: 10px !important;
}

.major-search .arco-picker-size-medium input {
    font-size: 10px !important;
}
</style>
